<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="/css/main.css">
    <link rel="stylesheet" href="/js/Grid/css/grid.css">
    <script src="/js/jquery-3.3.1.min.js"></script>
    <script src="/js/main.js"></script>
    <script src="/js/Grid/js/grid.js"></script>
    <script>
        window.addEventListener("message", evt => {
            var data = evt.data;
            schema = data.schema;
            table = data.table;
            loadGrid();
        });
    </script>
</head>

<body>
    <div id="grid"></div>
    <script>
        var schema, table;
        $(function () {
            initColumnsGrid();
        });
        var data;
        var gridColumns;
        function initColumnsGrid() {
            gridColumns = new Grid("grid", {
                isFixHead: true,
                sizeColumn: true,
                height: 100,
                isPage: false,
                colWidths: [
                    30, 200, 80, 80, 100, 80, 80, 150
                ],
                headArr: [
                    [
                        { text: "序号" },
                        { text: "名称" },
                        { text: "触发时机" },
                        { text: "触发条件" },
                        { text: "?禁用" },
                        { text: "?禁用复制" },
                        { text: "脚本" },
                        { text: "创建时间" }
                    ]
                ],
                columnArr: [
                    { type: "index" },
                    { type: "lab", name: "name", cutLen: 30, title: "name" },
                    {
                        type: "lab", formatter: function (col, tdconf) {
                            if (col.isAfter) {
                                return "执行后";
                            } else {
                                return "执行前";
                            }
                        }
                    },
                    {
                        type: "lab", formatter: function (col, tdconf) {
                            if (col.isDelete) {
                                return "delete";
                            } else if (col.isInsert) {
                                return "insert";
                            } else if (col.isUpdate) {
                                return "update";
                            }
                        }
                    },
                    {
                        type: "lab", formatter: function (col, tdconf) {
                            if (col.isDisable) {
                                return "已禁用";
                            } else {
                                return "已启用";
                            }
                        }
                    },
                    {
                        type: "lab", formatter: function (col, tdconf) {
                            if (col.isNotForReplication) {
                                return "禁用复制";
                            } else {
                                return "允许复制";
                            }
                        }
                    },
                    { type: "lab", name: "createSql", title: "createSql" },
                    { type: "lab", name: "createTime" }
                ],
                onQuery: function (pageIndex, pageSize, orders) {
                    if (orders.length > 0) {
                        initColumns(orders);
                    }
                }
            });
            gridColumns.init({ data: [] });
        }
        function initColumns(orders) {
            var columns = data.triggers.map(col => {
                return col;
            });
            gridColumns.init({ data: columns });
            var height = document.body.clientHeight - 10 - 35;
            gridColumns.setHeight(height + "px");
        }
        function loadGrid() {
            showLoading();
            $.post("/api/manage/GetTableDetail", { schema, table }, function (res) {
                data = res.data;
                initColumns();
            }).always(hideLoading);
        }
    </script>
</body>

</html>